﻿<!DOCTYPE html>
<html>
<head>
    <title>CGI</title>
</head>
<body>
    <h1>Our Page</h1>
    <script>
        //01 ReferenceError: productIdis not defined

        console.log(productId);

        //02//no error
        //1st pass the compiler see the variable declared, comiler aware of it
        //2nd pass exceute the console.log, the comipler knows about glaobal variable, but not set yet, set default undefined
        /*
        console.log(productId);
        var productId = '9000';
        */

        //03 undefined multiply undefined
        /*
        var total = price * quantity;
        var price = 3.00;
        var quantity = 5;
        console.log(total);
        */

        //04 hoisting works fine with function. 1st pass compiler fines the function & be able to execute in 2nd pass
        /*
        showProduct();
        function showProduct() {
            console.log('Showing a Product');
        }
        */

        //05 function expression, showProduct is undefined
        /*
        showProduct();
        var showProduct = function () {
            console.log('Showing a Product');
        }
        */

        //06 avoid hoisting
        /*
        var showProduct = function () {
            console.log('Showing a Product');
        }
        showProduct();
        */
    </script>
</body>
</html>